<template>
  <div class="list-operation">
    <el-link v-if="showView" size="mini" type="primary" style="margin-left:0px;" @click="parent.toView(phase)">
      <span style="font-size: 12px;">查看</span>
    </el-link>
    <el-divider v-if="showEdit && showView" direction="vertical" />
    <el-link v-if="showEdit" size="mini" type="warning" style="margin-left:0px;" @click="parent.toEdit(phase)">
      <span style="font-size: 12px;">编辑</span>
    </el-link>
    <el-divider v-if="showPublic" direction="vertical" />
    <el-link v-if="showPublic" size="mini" type="warning" style="margin-left:0px;" @click="parent.toPublish(phase)">
      <span style="font-size: 12px;">发布</span>
    </el-link>
    <el-divider v-if="showDelete" direction="vertical" />
    <el-link v-if="showDelete" size="mini" type="danger" style="margin-left:0px;color:red;" @click="parent.deleteById(phase)">
      <span style="font-size: 12px;">删除</span>
    </el-link>
  </div>
</template>
<script>
export default {
  props: {
    parent: {
      type: Object,
      default: null
    },
    phase: {
      type: Object,
      default: null
    }
  },
  computed: {
    showView: function() {
      return this.phase.dataStatus !== undefined &&
        this.phase.dataStatus !== null &&
        this.phase.dataStatus !== 0 && this.phase.dataStatus !== 1
    },
    showDelete: function() {
      return this.phase.dataStatus !== undefined &&
        this.phase.dataStatus !== null &&
        this.phase.dataStatus === 0 || this.phase.dataStatus === 1
    },
    showEdit: function() {
      return this.phase.dataStatus !== undefined &&
        this.phase.dataStatus !== null &&
        this.phase.dataStatus === 0 || this.phase.dataStatus === 1
    },
    showPublic: function() {
      return this.phase.dataStatus !== undefined &&
        this.phase.dataStatus !== null &&
        this.phase.dataStatus === 0
    }
  }
}
</script>
<style scoped>
  .list-operation >>> .el-divider--vertical {
    margin: 0 2px
  }
</style>
